<template>
  <div>
    <el-container>
      <el-aside width="300px">
        <div style="border-radius: 4px;width: 280px;height: 300px;">

          <span>考生姓名:{{student.name}}</span>
          <span style="float: right">试卷总分:{{student.total_score}}</span>
          <el-image :src="src" style="width: 200px;margin-left: 36px;height: 200px ;margin-top: 20px">
            <div slot="placeholder" class="image-slot">
              加载中<span class="dot">...</span>
            </div>
          </el-image><br>
          <span style="margin-left: 80px;">考试时长:{{student.time}}</span>
        </div>
      </el-aside>
      <el-main>
        <el-form ref="form" :model="form" label-width="80px">
          <h1 v-if="singleList.length!=0">
              选择题【本部分共{{single.count}}个小题，
              每小题{{ single.score }}分，共计{{single.total_score}}分；
              在每小题给出的选项中，仅有一项是符合题目要求的】</h1>
                  <div v-for="(item,index) in singleList"  style="margin-top: 16px">
                    <p style="margin-left: 80px">{{(index+1)+","}}{{item.title}}</p>
                    <el-form-item >
                      <el-radio-group v-model="dataSingle[index]">
                        <el-radio :label="item.choose1.option" >A.{{item.choose1.text}}</el-radio>
                        <el-radio :label="item.choose2.option">B.{{item.choose2.text}}</el-radio>
                        <el-radio :label="item.choose3.option">C.{{item.choose3.text}}</el-radio>
                        <el-radio :label="item.choose4.option">D.{{item.choose4.text}}</el-radio>

                      </el-radio-group>
                    </el-form-item>
                  </div>


                  <h1 v-if="multipleList.length !=0">
                    多选题【本部分共{{many.count}}个小题，
                    每小题{{ many.score }}分，共计{{many.total_score}}分；
                    在每小题给出的选项中，最少两项是符合题目要求的】</h1>
                  <div v-for="(item,index) in multipleList"  style="margin-top: 16px">
                    <p  style="margin-left: 80px">{{(index+1)+","}}{{item.title}}</p>
                  <el-form-item >
                    <el-checkbox-group v-model="dataMultiple[index]">
<!--                      <el-checkbox :label="item.choose1.option" name="type">A.{{item.choose1.text}}</el-checkbox>-->
<!--                      <el-checkbox :label="item.choose2.option" name="type">B.{{item.choose2.text}}</el-checkbox>-->
<!--                      <el-checkbox :label="item.choose3.option" name="type">C.{{item.choose3.text}}</el-checkbox>-->
<!--                      <el-checkbox :label="item.choose4.option" name="type">D.{{item.choose4.text}}</el-checkbox>-->
                          <el-checkbox v-for="i in item.choose" :label="i" name="type">{{i.option+","+i.text}}</el-checkbox>
                    </el-checkbox-group>

                  </el-form-item>
                    </div>
                  <el-form-item style="margin-left: 200px">
                    <el-button type="primary" @click="onsubmit">立即交卷</el-button>
                    <el-button>取消</el-button>
                  </el-form-item>
                </el-form>
              </el-main>
                </el-container>
              </div>

            </template>

            <script>
            export default {

              name: "testPaper",
              data () {
                return {
                  examAdministration:{
                    id:null,
                    isExam:null,
                  },
                  form:{
                  type:[]
                  },
                  //存放考生单选题答案
                  dataSingle:[],
                  //存放考生多选题答案
                  dataMultiple:[


                  ],
                  //存放正确答案
                  ok_answer:[[],[],[],[]],
                  //单选题列表
                  singleList :[
                  ],
                  //多选题列表
                  multipleList:[
                  ],
                  //学生信息
                  student:{
                    name:"张三",
                    total_score:100,
                    time:120,
                  },
                  //多选分信息
                  many:{
                    count:null,
                    score:null,
                    total_score: null
                  },
                  //考试id
                  examId:null,
                  paperId:null,
                  //单选分信息
                  single:{
                    count:null,
                    score:null,
                    total_score: null
                  },
                  src: 'https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg',
                  studentAnswer:{
                    userId :1,
                    singleAnswer:null,
                    manyAnswer:null,
                    rightAnswer:null,
                    createTime:null,
                    paperId:null,
                    grade:null
                  },
                  grade_score:{
                    single_score:0,
                    many_score:0,
                    total_score:0
                  }
                }
              },
              methods: {
                onsubmit(){
                  this.studentAnswer.singleAnswer = JSON.stringify(this.dataSingle)
                  this.studentAnswer.manyAnswer = JSON.stringify(this.dataMultiple)
                  this.studentAnswer.createTime = new Date()
                  this.studentAnswer.paperId = this.paperId
                  this.studentAnswer.userId = 1
                  this.studentAnswer.examId = this.examId
                  for(let i = 0, j= 0; i<this.ok_answer[0].length;j<this.dataSingle.length,j++,i++){
                    if(this.dataSingle[j] == this.ok_answer[0][i]){
                        this.grade_score.single_score=parseInt(this.grade_score.single_score)+parseInt(this.single.score)
                    }
                  }



                  for (let i = 0,j = 0;i<this.ok_answer[1].length;j<this.dataMultiple.length,i++,j++){

                    this.dataMultiple[j].sort()
                    console.log(this.dataMultiple[j])
                    let q = ""
                    let options = []

                    for (let k of this.dataMultiple[j]){
                      options.push(k.option)
                      // if(q !=""){
                      //   q = q+','+k.option
                      // }else {
                      //   q = k.option
                      // }

                    }
                    options.sort()
                    for(let i of options){
                      if(q !=""){
                        q = q+','+i
                      }else {
                        q = i
                      }
                    }
                    console.log(q)
                    if(q==this.ok_answer[1][i]){
                      this.grade_score.many_score = parseInt(this.grade_score.many_score)+parseInt(this.many.score)
                    }

                  }

                  this.grade_score.total_score = parseInt(this.grade_score.single_score)+parseInt(this.grade_score.many_score)
                  //this.$message("你的考试成绩是:"+this.grade_score.total_score)
                  this.studentAnswer.grade = this.grade_score.total_score
                  console.log(this.examId)
                  this.examAdministration.id =this.examId
                      this.examAdministration.isExam = 1

                  this.$axios.post("http://localhost:8080/examAdministration/updateOne",this.examAdministration)
                  this.$axios.post('http://localhost:8080/studentAnswerController/saveAnswer',this.studentAnswer).then(
                      res=>{
                        if(res.data.code == 200){
                          //this.$message("保存成功")
                          this.$router.push("test/examResults")
                        }
                      }
                  ).catch()
                },
                findById(paperId){
                  this.$axios.post('http://localhost:8080/testPaper/findById/'+paperId).then(
                      res=>{

                        console.log(res.data.data)
                        let subject = JSON.parse(res.data.data.subject)
                        for(let i of subject){

                          if(i.type==1) {
                            let option = JSON.parse(i.options)
                            let choose = []
                            let index = 0
                            this.single.count++
                            this.single.score = i.score
                            for(let j in option){

                              choose[index]  = {
                                option:j,
                                text:option[j]
                              }
                              index =index+1
                            }
                            this.ok_answer[0].push(i.answer)
                            this.singleList.push(
                                {
                                  id:i.id,
                                  title:i.content,
                                  choose1:choose[0],
                                  choose2:choose[1],
                                  choose3:choose[2],
                                  choose4:choose[3],
                                }
                            )
                          }
                          if(i.type == 2){
                            let option = JSON.parse(i.options)
                            let choose = []
                            let index = 0
                            this.many.count++
                            this.many.score = i.score
                            for(let j in option){

                              // choose[index]  = {
                              //   option:j,
                              //   text:option[j]
                              // }
                              // index =index+1
                              choose.push(
                                  {
                                    option:j,
                                    text:option[j]
                                  }
                              )
                            }
                            this.ok_answer[1].push(i.answer)

                            this.multipleList.push(
                                {
                                  id:i.id,
                                  title:i.content,
                                  // choose1:choose[0],
                                  // choose2:choose[1],
                                  // choose3:choose[2],
                                  // choose4:choose[3],
                                  choose:choose
                                }
                            )
                            console.log(this.multipleList)

                          }
                        }

                        let i  = this.multipleList.length
                        for(let j = 0;j<i;j++){
                          this.dataMultiple.push([])

                        }
                        this.single.total_score = this.single.score * this.single.count
                        this.many.total_score = this.many.score * this.many.count
                        this.student.total_score = res.data.data.total_score
                        return this.multipleList.length

                      }
                  ).catch()
                }
              },
              created() {
                this.paperId = this.$route.query.paperMessage
                this.examId = this.$route.query.examId
                this.student.time = this.$route.query.examTime
                this.student.name = this.$route.query.studentName

                this.findById(this.paperId)

              }
            }
            </script>

            <style scoped>

            </style>